<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:p="http://primefaces.prime.com.tr/ui"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>Insertar proyecto de apadrinamiento</title>
        <link href="recursos/general.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript">
            function crearComplete(xhr, status, args){
               if(args.Falta){
                   falta.show();
               }else if(args.Correcto){
                   correcto.show();
               }else if(args.Repetido){
                   repetido.show();
               }else if(args.Incorrecto){
                   incorrecto.show();
               }else if(args.noPersona){
                   noPersona.show();
               }else if(args.PersonaOK){
                   pContactoDialog.hide();
               }
            }
            function descargar(archivo){
                window.open(archivo); 
            }
        </script>
    </h:head>
    <h:body>
        <h:form id="datos">
            <!--Mensajes que se muestran cuando no se rellena un campo requerido -->
            <p:messages id="mensajes"/>

            <!--Nos mostrará el título de la página -->
            <h:outputText value="#{insertar_ProyectoApadrinamiento.titulo}" styleClass="textoTitulo" style="margin-left: 50px;"/>

            <!--Panel que permite la inserción de los datos referentes al 
            proyeto de apadrinamiento-->
            <p:panel id="display" styleClass="panel1" style="margin-left: 50px; margin-top: 10px;">  
                <table>
                    <tr>
                        <td>
                            <h:outputText value="Nombre: *" styleClass="texto"/>
                        </td>
                        <td colspan="3">
                            <p:inputText id="Nombre" value="#{insertar_ProyectoApadrinamiento.proyecto.nombre}" required="true" styleClass="textoI"
                                         style="width: 470px !important;"/> 
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <h:outputText value="Localidad:" styleClass="texto"/> 
                        </td>
                        <td>
                            <p:inputText value="#{insertar_ProyectoApadrinamiento.proyecto.localidad}" styleClass="textoI"/> 
                        </td>
                        <td>
                            <h:outputText value="Provincia:" styleClass="texto"/>  
                        </td>
                        <td>
                            <p:inputText value="#{insertar_ProyectoApadrinamiento.proyecto.provincia}" styleClass="textoI"/> 
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <h:outputText value="Región:" styleClass="texto"/> 
                        </td>
                        <td>
                            <p:inputText value="#{insertar_ProyectoApadrinamiento.proyecto.region}" styleClass="textoI"/> 
                        </td>
                        <td>
                            <h:outputText value="Pais: *" styleClass="texto"/>  
                        </td>
                        <td>
                            <p:inputText id="Pais" value="#{insertar_ProyectoApadrinamiento.proyecto.pais}" required="true" styleClass="textoI"/> 
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <h:outputText value="Socio local:" styleClass="texto"/>  
                        </td>
                        <td>
                            <p:inputText  value="#{insertar_ProyectoApadrinamiento.proyecto.socioLocal}" styleClass="textoI"/>  
                        </td>
                        <td>
                            <h:outputText value="Responsable de la ONGD: *" styleClass="texto"/> 
                        </td>
                        <td>
                            <p:inputText id="ResponsabledelaONGD" value="#{insertar_ProyectoApadrinamiento.proyecto.responsableONGD}" required="true" 
                                         styleClass="textoI"/> 
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <h:outputText value="Presupuesto total:" styleClass="texto"/>  
                        </td>
                        <td>
                            <p:inputText value="#{insertar_ProyectoApadrinamiento.proyecto.presupuestoTotal}" styleClass="textoI"/>
                        </td>
                        <td>
                            <h:outputText value="Documento Adjunto:" styleClass="texto"/> 
                        </td>
                        <td>
                            <h:panelGrid columns="2">
                                <p:fileUpload auto="true" fileUploadListener="#{insertar_ProyectoApadrinamiento.subirAdjunto}" update="adjuntoDescarga"/>
                                <p:commandButton id="adjuntoDescarga" type="button" value="Descargar" disabled="#{insertar_ProyectoApadrinamiento.proyecto.documentoAdjunto==null}"
                                                 onclick="descargar('ficherosAdjuntos/#{insertar_ProyectoApadrinamiento.proyecto.documentoAdjunto}')"
                                                 styleClass="botonNormal"/>
                            </h:panelGrid>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <h:outputText value="Descripción:" styleClass="texto"/> 
                        </td>
                        <td colspan="3">
                            <p:inputTextarea value="#{insertar_ProyectoApadrinamiento.proyecto.descripcion}" styleClass="textoI"
                                             autoResize="false" style="width: 470px !important;"/> 
                        </td>
                    </tr>
                </table>
            </p:panel>
            <p:panel id="botones" styleClass="panel1" style="margin-left: 50px; margin-top: 10px;">
                <h:outputText value="Tipo de proyecto:" styleClass="texto" style="margin-right: 5px;"/>
                <p:commandButton id="botonPersonal" value="Apadrinamiento Personal" action="#{insertar_ProyectoApadrinamiento.insertarApadrinado}" 
                                 disabled="#{insertar_ProyectoApadrinamiento.insertarApadrinado}" 
                                 update="botonNuevoApad, botonPersonal, botonGeneral, tablaApadrinados, mensajes" styleClass="botonNormal"/>
                <p:commandButton id="botonGeneral" value="General" action="#{insertar_ProyectoApadrinamiento.insertarApadrinado}" 
                                 disabled="#{!insertar_ProyectoApadrinamiento.insertarApadrinado}"  
                                 update="botonNuevoApad, botonPersonal, botonGeneral, tablaApadrinados, mensajes" styleClass="botonNormal"/>
            </p:panel>

            <p:separator />
            <!--Panel que mostrará todas las personas de contacto que se han añadido -->
            <h:panelGrid id="bbb" columns="2" cellpadding="3" style="margin-left: 50px;">
                <p:dataTable id="tablaPersonasContacto" value="#{insertar_ProyectoApadrinamiento.listaPersonaContacto}" 
                             var="personaC" emptyMessage="No tiene personas de contacto"  paginator="true" paginatorPosition="bottom" rows="3"> 
                    <f:facet name="header">
                        Personas de contacto
                    </f:facet>
                    <p:column headerText="Nombre">                     
                        #{personaC.nombre}
                    </p:column> 
                    <p:column headerText="Apellidos">                     
                        #{personaC.apellidos}
                    </p:column>
                    <p:column headerText="Teléfono 1">                     
                        #{personaC.telefono1}
                    </p:column>
                    <p:column>
                        <p:commandButton update="bbb, datos:tablaPersonasContacto" action="#{insertar_ProyectoApadrinamiento.quitarPersonaContacto}"
                                         image="ui-icon ui-icon-closethick" title="Quitar">  
                            <f:setPropertyActionListener value="#{personaC}" target="#{insertar_ProyectoApadrinamiento.personaContacto}" />  
                        </p:commandButton> 
                    </p:column>
                </p:dataTable>
                <p:commandButton  value="Añadir" oncomplete="pContactoDialog.show()" type="Button" update="mensajes"
                                  styleClass="botonNormal"/>
            </h:panelGrid>

            <!--Dialogo que permite insertar los datos de la nueva persona de contacto asociada al proyecto -->
            <p:dialog id="pContacto" header="Datos de la persona de contacto" widgetVar="pContactoDialog" resizable="false"  
                      width="550" modal="true" styleClass="dialogoNormal">                
                <p:panel id="personaContacto"> 
                    <table>
                        <tr>
                            <td>
                                <h:outputText value="Nombre*:" styleClass="texto"/> 
                            </td>
                            <td>
                                <p:inputText id="NombrePer" value="#{insertar_ProyectoApadrinamiento.personaContacto.nombre}" styleClass="textoI"/> 
                            </td>
                            <td>
                                <h:outputText value="Apellidos:" styleClass="texto"/>  
                            </td>
                            <td>
                                <p:inputText value="#{insertar_ProyectoApadrinamiento.personaContacto.apellidos}" styleClass="textoI" />
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <h:outputText value="Direccion*:" styleClass="texto"/>  
                            </td>
                            <td colspan="3">
                                <p:inputText id="Direccion" value="#{insertar_ProyectoApadrinamiento.personaContacto.direccion}" 
                                             style="width: 360px !important;" styleClass="textoI" />
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <h:outputText value="Cargo*:" styleClass="texto"/>
                            </td>
                            <td>
                                <p:inputText value="#{insertar_ProyectoApadrinamiento.personaContacto.cargo}" styleClass="textoI"/>  
                            </td>
                            <td>
                                <h:outputText value="Email:" styleClass="texto"/>  
                            </td>
                            <td>
                                <p:inputText value="#{insertar_ProyectoApadrinamiento.personaContacto.email}" styleClass="textoI"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <h:outputText value="Telefono 1*:" styleClass="texto"/> 
                            </td>
                            <td>
                                <p:inputText id="Telefono1" value="#{insertar_ProyectoApadrinamiento.personaContacto.telefono1}" styleClass="textoI" /> 
                            </td>
                            <td>
                                <h:outputText value="Telefono 2:" styleClass="texto"/> 
                            </td>
                            <td>
                                <p:inputText value="#{insertar_ProyectoApadrinamiento.personaContacto.telefono2}" styleClass="textoI"/>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <h:outputText value="Observaciones" styleClass="texto"/>
                            </td>
                            <td colspan="3">
                                <p:inputTextarea value="#{insertar_ProyectoApadrinamiento.personaContacto.observaciones}" 
                                                 autoResize="false" style="width: 360px !important;" styleClass="textoI"/>  
                            </td>
                        </tr>
                    </table>
                </p:panel>
                <p:commandButton  value="Insertar" action="#{insertar_ProyectoApadrinamiento.annadirPersonaContacto()}"
                                  oncomplete="crearComplete(xhr, status, args)" update="tablaPersonasContacto,personaContacto"
                                  styleClass="botonNormal" style="margin-top: 5px;"/>
            </p:dialog>

            <p:separator />

            <!--Panel que muestra los apadrinamientos asociados al proyecto que se va a crear -->
            <h:panelGrid columns="2" cellpadding="3" style="margin-left: 50px;">
                <p:dataTable id="tablaApadrinados" value="#{insertar_ProyectoApadrinamiento.controlApadrin.apadrinados}" 
                             var="apadrinado" emptyMessage="No tiene apadrinados" paginator="true" paginatorPosition="bottom" rows="3"> 
                    <f:facet name="header">
                        Apadrinados
                    </f:facet>
                    <p:column headerText="Nombre">                     
                        #{apadrinado.nombre} 
                    </p:column> 
                    <p:column headerText="Apellidos">                     
                        #{apadrinado.apellidos} 
                    </p:column>
                    <p:column>
                        <p:commandButton update="datos:tablaApadrinados" action="#{insertar_ProyectoApadrinamiento.quitarApadrinado}"
                                         image="ui-icon ui-icon-closethick" title="Quitar">  
                            <f:setPropertyActionListener value="#{apadrinado}" target="#{insertar_ProyectoApadrinamiento.apadrinado}" />  
                        </p:commandButton> 
                    </p:column>
                </p:dataTable>
                <p:commandButton  id="botonNuevoApad" value="Añadir" oncomplete="apadrinadoDialog.show()"
                                  disabled="#{!insertar_ProyectoApadrinamiento.insertarApadrinado}" type="Button" update="mensajes" 
                                  styleClass="botonNormal"/>
            </h:panelGrid>
            <p:separator />
            <p:commandButton value="Crear" action="#{insertar_ProyectoApadrinamiento.guardarProyecto()}" oncomplete="crearComplete(xhr, status, args)" 
                             update="display, botones, mensajes, panel, tablaPersonasContacto, tablaApadrinados" style="margin-left: 50px;" styleClass="botonGrande"/>           
            <p:commandButton id="cerrarApadrinDialog" type="button" onclick="apadrinadoDialog.hide()" style="visibility: hidden"/>

            <!--Dialogo que mostrará la pantalla para insertar un apadrinado -->
            <p:dialog id="apadrinDialog" header="Datos del apadrinado" widgetVar="apadrinadoDialog" resizable="false"  
                      width="800" height="400" onCloseUpdate="tablaApadrinados" modal="true" styleClass="dialogoNormal">          
                <iframe src="insertar_Apadrinado.xhtml?nuevo=no" width="100%" height="100%" />
            </p:dialog> 

            <!--Dialogo de confirmación que indica que el proyecto se ha guardado correctamente -->
            <p:confirmDialog message="El proyecto ha sido guardado correctamente." severity="info" widgetVar="correcto" modal="true" styleClass="dialogoGrande"/>

            <!--Dialogo de confirmación que indica que el proyecto no se ha guardado correctamente -->
            <p:confirmDialog message="El proyecto no se ha guardado correctamente." severity="info" widgetVar="incorrecto" modal="true" styleClass="dialogoGrande"/>

            <!--Dialogo de confirmación que indica que el nombre insertado ya está repetido -->
            <p:confirmDialog message="El nombre del proyecto es repetido." severity="info" widgetVar="repetido" modal="true" styleClass="dialogoGrande"/>

            <!--Dialogo de confirmación que informa de que hay que seleccionar al menos un apadrinado -->
            <p:confirmDialog message="El proyecto debe tener al menos un apadrinado, sino cambia el tipo de proyecto." severity="info" widgetVar="falta"
                             modal="true" styleClass="dialogoGrande"/>
            <!--Dialogo de confirmación que informa de que hay que rellenar los campos obligatorios de una persona de contacto -->
            <p:confirmDialog message="Rellene los datos obligatorios para insertar una persona de contacto." severity="info" widgetVar="noPersona"
                             modal="true" styleClass="dialogoGrande"/>
        </h:form>
    </h:body>
</html>